<%--
  Created by IntelliJ IDEA.
  User: 12699
  Date: 2019/10/22
  Time: 9:35
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script type="text/javascript" src="/js/jquery-1.12.4.js"></script>
    <script type="text/javascript" src="/js/vue.js"></script>
    <link href="/css/blog.css" rel="stylesheet" type="text/css" />
    <script>
        $(function () {
            //vue核心对象，用来存储数据
            var myModel = {pageInfo: []};
            var vm = new Vue({
                el: "#userlist",
                data: myModel,
                methods: {
                    selectUsers: function (data) {
                        selectUsers(data);
                    }
                }
            });
            //定义访问后台的代码
            function selectUsers(pageNum) {
                $.post("/users/getUsers.do",
                    {pageIndex: pageNum},
                    function (result) {
                        myModel.pageInfo = result;
                    }, "json");
            }
            selectUsers(1);
        });
    </script>
</head>
<body>
<div class="tou">
    <span>你好！欢迎访问微博信息管理系统！
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <button><a href="/jsp/addUser.jsp">注册用户</a></button>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <a href="/jsp/login.jsp">退出</a></span>
</div>
<div id="userlist" class="shenti">
    <div class="daohanglan">
        &nbsp;&nbsp;<img src="../img/cbca329de67b6a877a58bf471bb96ab.png"><a href="/jsp/index.jsp"><img
            src="../img/0ded27f53f3822d25f04b444a4d6053.png">微博管理</a>
        <br>
        <br>
        &nbsp;&nbsp;<img src="../img/cbca329de67b6a877a58bf471bb96ab.png"><a href="/jsp/QueryUser.jsp"><img
            src="../img/0ded27f53f3822d25f04b444a4d6053.png">账户管理</a>
    </div>
    <div class="shuju">
        <span style="font-size: 28px">用户管理</span>
        <hr>
        <table>
            <tr v-for="u in pageInfo.list">
                <td>用户名：{{u.username}}。</td>
                <td>昵称：{{u.nickname}}。</td>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <td>手机：{{u.mobile}}</td>
                <td>地址：{{u.address}}</td>
                <td><a href="">删除该条</a></td>
            </tr>
        </table>
        <br>
        <br>
        <br>
        <br>
        <br>
        &nbsp;&nbsp;<button v-on:click="selectUsers(pageInfo.firstPage)">首页</button>
        <button v-on:click="selectUsers(pageInfo.prePage)">上一页</button>
        <button v-on:click="selectUsers(pageInfo.nextPage)">下一页</button>
        <button v-on:click="selectUsers(pageInfo.lastPage)">末页</button>
        <br>
        <br>
    </div>
</div>
</body>
</html>
